/**
Copyright 2015 The Cockroach Authors.

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
implied. See the License for the specific language governing
permissions and limitations under the License.

Author: Matt Tracy (matt@cockroachlabs.com)
*/

@require '../modules/*'

$stats-table-cell--border = 1px solid $secondary-gray-8

$stats-table-th--fg = $secondary-gray-6
$stats-table-td--fg = $main-navy

$stats-table-th--bg     = white
$stats-table-tr--bg     = white
$stats-table-tr--bg-alt = $secondary-gray-7

// ---- Data table ----
.stats-table, .sql-table, .event-table, .logs-table
  table
    border-collapse collapse
    margin-bottom 2rem

  thead
    tr
      border $stats-table-cell--border
      border-left none
      border-top none
      height 30px
      vertical-align top
      &.header-section
        height 30px
      &.column
        border-bottom none
      &.rollup
        border-top none
      &:last-child
        th
          padding-bottom 15px

  tbody tr
      height 45px
      background-color $stats-table-tr--bg
      &:nth-child(odd)
        background-color $stats-table-tr--bg-alt
      &:last-child
        border-bottom $stats-table-cell--border
      &:first-child
        border-top $stats-table-cell--border

  th
    color $stats-table-th--fg
    font-family Lato-Bold
    font-size 12px
    letter-spacing .27px
    font-weight normal
    text-align left
    background-color $stats-table-th--bg
    white-space nowrap
    &.column
      border-bottom none

    &.header-section
      font-size 12px
      font-family Lato-Medium
      letter-spacing 2px
      text-transform uppercase
      color $secondary-light-gray
      padding 10px 20px

    &.rollup
      border-top none
      font-family Lato-Medium
      color $main-navy
      font-size 19px
      padding-top 0
      .units
        font-size 13px

    &.sorted
      &:after
        content "▼"
      &.ascending
        &:after
          content "▲"

  td
    color $stats-table-td--fg
    font-family Lato-Regular
    font-size 13px
    letter-spacing .33px
    white-space nowrap
    .units
      font-size 12px

  td
  th
    padding 10px 15px
    border-right $stats-table-cell--border
    .missing
      color $secondary-red
    .stale
      color $secondary-gold
    .healthy
      color $main-green

table
  a
    color $main-green
    text-decoration none

.sql-table
  thead
    border-left $stats-table-cell--border
  tr
    border-left $stats-table-cell--border

.stat
  .title
    display inline-block
    width 20rem

.stats-table
  table
    min-width 100%

.node-overview
  .stats-table
    table
      td, th
        &:first-child
          width: calc(45px - 3rem)

.event-table
  table
    width 100%
    margin-bottom 0
    tbody
      td
        border 0
        padding 20px
        &:first-child
          padding-left 3rem
        font-size 16px
        font-family Lato-Medium
        &:first-child
          width 50px
        &:nth-child(2)
          width 75px

        .message
          font-size 14px

      tr
        height 60px
        width 100%

        &:first-child
          border 0

.logs-table
  padding 0
